<template>
  <div class="order-index-page">
    <top class="top" :key="status+'-top'"></top>
    <middle class="middle" :key="status+'-middle'" @deleteOrder="deleteOrder"></middle>
  </div>
</template>

<script>
import Top from './layout/index/Top';
import Middle from './layout/index/Middle';

export default {
  name: "OrderIndexPage",
  props: {

  },
  data() {
    return {
      status: 'normal'
    };
  },
  computed: {

  },
  mounted() {
  },
  watch: {

  },
  methods: {
    /**
     * 删除订单成功，用orderId刷新当前页面信息
     * @param orderId
     */
    deleteOrder(orderId) {
      this.status = `delete-${orderId}`;
    }
  },
  components: {
    Top,
    Middle
  },
};
</script>

<style scoped lang="scss">
.order-index-page {
  >.top {
    margin-top: 2rem;
  }
  >.middle {
    margin: 40px;
  }
}
</style>
